<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>登录页面</title>
    <meta name="description" content="Latest updates and statistic charts">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <!-- 引入公用样式 -->
    <jsp:include page="/assets/common-css.jsp" />
    <script src="<%=request.getContextPath()%>/assets/vendors/base/vendors.bundle.js" type="text/javascript"></script>
    <script src="<%=request.getContextPath()%>/assets/common/md5.js" type="text/javascript"></script>
    <style type="text/css">
        .alert-danger:not(.m-alert--outline) {
            color: #fff;
            background-color: #ff0000ad;
            border-color: #ff0000ad;
        }
    </style>
</head>
<body  class="m-page--fluid m--skin- m-content--skin-light2 m-header--fixed m-header--fixed-mobile m-aside-left--enabled m-aside-left--skin-dark m-aside-left--offcanvas m-footer--push m-aside--offcanvas-default"  >
<div class="m-grid m-grid--hor m-grid--root m-page">
    <div class="m-grid__item m-grid__item--fluid m-grid m-grid--ver-desktop m-grid--desktop m-grid--tablet-and-mobile m-grid--hor-tablet-and-mobile m-login m-login--1 m-login--signin" id="m_login">
        <div class="m-grid__item m-grid__item--order-tablet-and-mobile-2 m-login__aside">
            <div class="m-stack m-stack--hor m-stack--desktop">
                <div class="m-stack__item m-stack__item--fluid">
                    <div class="m-login__wrapper">
                        <div class="m-login__logo">
                            <a href="#">
                                <img src="<%=request.getContextPath()%>/assets/app/media/img/logos/logo-4.png">
                            </a>
                        </div>
                        <div class="m-login__signin">
                            <div class="m-login__head">
                                <h3 class="m-login__title">
                                    用户登录
                                </h3>
                            </div>
                            <div class="m-login__form m-form">
                                <div class="form-group m-form__group">
                                    <input class="form-control m-input" autofocus type="text" placeholder="用户名" id="usercode" autocomplete="off">
                                </div>
                                <div class="form-group m-form__group">
                                    <input class="form-control m-input" type="password" placeholder="密码" id="password">
                                </div>
                                <div id="err" class="alert alert-danger" role="alert" style="display: none;">

                                </div>
                                <div class="m-login__form-action">
                                    <button id="m_login_signin_submit" class="btn btn-focus m-btn m-btn--pill m-btn--custom m-btn--air">
                                        登录
                                    </button>
                                    <button id="customer_registration" class="btn btn-focus m-btn m-btn--pill m-btn--custom m-btn--air"
                                            style="background-color:#aaa;border-color:#aaa">
                                        用户 注册
                                    </button>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="m-grid__item m-grid__item--fluid m-grid m-grid--center m-grid--hor
				m-grid__item--order-tablet-and-mobile-1	m-login__content"
             style="background-image: url(<%=request.getContextPath()%>/assets/app/media/img/bg/bg-4.jpg);padding: 5rem 2rem 5rem 2rem;">
            <div class="m-grid__item m-grid__item--middle">
                <h3 class="m-login__welcome" style="font-size: 2.5rem; text-align: center;">
                    遥感影像智能云检测系统
                </h3>
            </div>
            <div class="form-group m-form__group row" style="margin-top: 120px">
                <label class="col-lg-2 col-form-label" style="text-align:right;color: white;">
                    系统版本
                </label>
                <div class="col-lg-5">
                    <input type="text" class="form-control" style= "background-color:transparent;border:0;color: white;" readonly
                           lay-verType="tips" id="versionno" name="versionno">
                </div>
            </div>
            <div class="form-group m-form__group row" style="margin-top: -20px">
                <label class="col-lg-2 col-form-label" style="text-align:right;color: white;">
                    更新日期
                </label>
                <div class="col-lg-5">
                    <input type="text" class="form-control" style= "background-color:transparent;border:0;color: white;" readonly
                           lay-verType="tips" id="versiontime">
                </div>
            </div>
            <div class="form-group m-form__group row"style="margin-top: -20px">
                <label class="col-lg-2 col-form-label" style="text-align:right;color: white;">
                    更新内容
                </label>
                <div class="col-lg-10">
                    <ul class="form-control" id="content"
                        style= "background-color:transparent;border:0;width: 530px;"readonly>
                    </ul>
                </div>
            </div>
        </div>
    </div>
</div>
</body>
<script type="application/javascript">
    //加载版本信息
    var hcSysVersionVO = ${hcSysVersionVO == null ? false : hcSysVersionVO};
    if(hcSysVersionVO != null && hcSysVersionVO.versionno !== null && hcSysVersionVO.versionno !== "") {
        //版本号
        $("#versionno").val(hcSysVersionVO.versionno);
        //更新时间
        $("#versiontime").val("2023-02-17 17:07:07");
        //更新内容，按条加载
        var hcSysVersionVOList=hcSysVersionVO.hcSysVersionVOList;
        for (var i = 0; i < hcSysVersionVOList.length; i++) {
            $("#content").append("<li style='width: 500px;word-break:break-all;color: white;'>"+(i+1)+"、"+hcSysVersionVOList[i].content+"</li>");
        }
    }

    var errmsg = '${message == null ? '' : message}';
    if (errmsg != '') {
        showErrorMessage(errmsg);
    }

    var localObj = window.location;
    var contextPath = localObj.pathname.split("/")[1];
    var basePath = localObj.protocol+"//"+localObj.host+"/"+contextPath;
    jQuery(document).ready(function() {
        $("#m_login_signin_submit").on("click", function () {
            doLogin();
        });
        $(document).keypress(function(e) {
            // 回车键事件
            if(e.which == 13) {
                doLogin();
            }
        });
    });

    function doLogin() {
        if ($.trim($("#usercode").val()) == '') {
            showErrorMessage("用户名不能为空");
            return;
        }
        if ($.trim($("#password").val()) == '') {
            showErrorMessage("密码不能为空");
            return;
        }

        $.ajax({
            url: basePath + '/login',
            type: 'get',
            dataType: 'json',
            data: {
                usercode: $.trim($("#usercode").val()),
                //20210104 by fangtao 前端加密
                password: randomString(false, 33) + $.md5($.trim($("#password").val())) + randomString(false, 23),
            },
            success: function (json) {
                if (json.code === 'ok') {
                    window.location.href = basePath + "/";
                } else {
                    showErrorMessage(json.msg);
                }
            },
            error: function (jqXHR, textStatus, errorThrown) {
                showErrorMessage(jqXHR.status);
            }
        });
    }

    function showErrorMessage(msg) {
        $("#err").show();
        $("#err").html(msg);
    }

    $("#customer_registration").on("click", function () {
        window.open(basePath + "/clientRegistration/registrationPage",'_self');
    });

    function randomString(randomLen, min, max){
        var str = "",
            range = min,
            arr = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9',
                'a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j', 'k',
                'l', 'm', 'n', 'o', 'p', 'q', 'r', 's', 't', 'u', 'v',
                'w', 'x', 'y', 'z', 'A', 'B', 'C', 'D', 'E', 'F',
                'G', 'H', 'I', 'J', 'K', 'L', 'M', 'N', 'O', 'P',
                'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X', 'Y', 'Z'];
        // 随机产生
        if(randomLen){
            range = Math.round(Math.random() * (max-min)) + min;
        }
        for(var i=0; i<range; i++){
            var pos = Math.round(Math.random() * (arr.length-1));
            str += arr[pos];
        }
        return str;
    }
</script>
</html>